<nz-table [nzData]="keys" [nzNoResult]="nokeys" #keylist>
    <thead>
    <tr>
        <th nzWidth="50px">Key name</th>
        <th nzWidth="50px">Key type</th>
        <th nzWidth="400px">Public key</th>
        <th nzWidth="25px" *ngIf="edit"></th>
    </tr>
    </thead>
    <tbody *ngFor="let k of keylist.data">
    <tr>
        <td>
            {{ k.name }} <span *ngIf="k.disabled" class="disabledKey">(disabled)</span>
        </td>
        <td>
            {{ k.type }}
        </td>
        <td nzBreakWord>
            <ng-container *ngIf="k.type === 'ssh'">
                <input nz-input readonly [ngModel]="k.public">
            </ng-container>
            <ng-container *ngIf="k.type === 'pgp'">
                <textarea nz-input [ngModel]="k.public" readonly rows="29"></textarea>
            </ng-container>
        </td>
        <td *ngIf="edit">
            <button nz-button nzDanger nzType="primary" [nzLoading]="loading" nz-popconfirm nzPopconfirmTitle="Are you sure you want to delete this key ?"
                    (nzOnConfirm)="deleteKey(k)">Delete</button>
        </td>
    </tr>
    </tbody>
</nz-table>
<ng-template #nokeys>
    <nz-alert nzType="info" nzMessage="There is no key"></nz-alert>
</ng-template>
